<!-- src/views/system/user/StandaloneBigScreen.vue -->
<template>
  <div class="standalone-big-screen">
    <Bussindessindex />
  </div>
</template>

<script>
import Bussindessindex from './Bussindessindex.vue'

export default {
  name: 'StandaloneBigScreen',
  components: {
    Bussindessindex
  },
  mounted() {
    // 页面加载后自动全屏
    this.$nextTick(() => {
      this.enterFullscreen()
    })
    
    // 禁用右键菜单（防止误操作）
    document.addEventListener('contextmenu', this.disableContextMenu)
    
    // 监听键盘事件
    document.addEventListener('keydown', this.handleKeyDown)
    
    // 隐藏滚动条
    document.body.style.overflow = 'hidden'
    document.documentElement.style.overflow = 'hidden'
  },
  beforeDestroy() {
    document.removeEventListener('contextmenu', this.disableContextMenu)
    document.removeEventListener('keydown', this.handleKeyDown)
    
    // 恢复滚动条
    document.body.style.overflow = ''
    document.documentElement.style.overflow = ''
  },
  methods: {
    enterFullscreen() {
      const element = document.documentElement
      if (element.requestFullscreen) {
        element.requestFullscreen().catch(err => {
          console.warn('全屏请求失败:', err)
        })
      } else if (element.webkitRequestFullscreen) {
        element.webkitRequestFullscreen()
      } else if (element.mozRequestFullScreen) {
        element.mozRequestFullScreen()
      } else if (element.msRequestFullscreen) {
        element.msRequestFullscreen()
      }
    },
    exitFullscreen() {
      if (document.exitFullscreen) {
        document.exitFullscreen()
      } else if (document.webkitExitFullscreen) {
        document.webkitExitFullscreen()
      } else if (document.mozCancelFullScreen) {
        document.mozCancelFullScreen()
      } else if (document.msExitFullscreen) {
        document.msExitFullscreen()
      }
    },
    disableContextMenu(event) {
      event.preventDefault()
    },
    handleKeyDown(event) {
      // ESC键退出全屏并返回首页
      if (event.key === 'Escape') {
        this.exitFullscreen()
        // 在独立页面中，ESC后不跳转路由，只退出全屏
      }
      
      // F11切换全屏
      if (event.key === 'F11') {
        event.preventDefault()
        if (document.fullscreenElement) {
          this.exitFullscreen()
        } else {
          this.enterFullscreen()
        }
      }
    }
  }
}
</script>

<style scoped>
.standalone-big-screen {
  width: 100vw;
  height: 100vh;
  background: #0a192f;
  overflow: hidden;
}

/* 隐藏滚动条 */
.standalone-big-screen::-webkit-scrollbar {
  display: none;
}
</style>